<template>
    <div class="myLogin">
       <div class="rollback" @click="JumpFn">
           <span class="iconfont icon-arrowLeft-fill"></span>
       </div>
       <div class="rolltitle">
           <span>加入孤岛</span>
       </div>
       <!-- 登录 -->
       <div class="loginout">
           <div class="telephone">
               <span>+86</span>
               <input type="text" placeholder="手机号" v-model="tele">
           </div>
           <div class="password">
               <input type="password" placeholder="密码" v-model="pass">
           </div>
       </div>
       <!-- 点击 -->
       <div class="user_hits">
           <button @click="loginCenter">登入</button>
           <div class="user_sign">
               <span @click="accountIn">手机注册</span>
           </div>
       </div>

    </div>
</template>

<script>
export default {
    data(){
        return{
          tele : "",
          pass : "",
          msg : "波吉",
          isShow : false,
        }
    },
    methods:{
        JumpFn(){
            this.$router.go(-1);
        },
        accountIn(){
            this.$router.push('/myenroll');
        },
        loginCenter(){
            //为空返回
            if(this.tele.length == 0 || this.pass.length == 0){
                return;
            }else{
            //获取注册数据
            var data = JSON.parse(sessionStorage.getItem("userobj"));
            var telephone = data.phone;
            var pass = data.password;
              if(this.tele == telephone && this.pass == pass){
                sessionStorage.setItem('show',this.isShow);
                this.$router.push({path:'/mycenter',name:'myCenter',params:{msg : this.msg}});
               }else{
            //    console.log("输入有误!");
               this.tele = "";
               this.pass = "";
               }
            }
            // console.log(telephone,pass);
        }
    },
    // created(){
    //     let pro = axios.get("http://localhost:8080/data_login.json",true);
    //        pro.then(
    //            response => {
    //                console.log(response);
    //                console.log(111);
    //            },
    //            error => {
    //                console.log(error);
    //            }
    //        )
    // }
}

// 信息
// 18756642897
// 123456
</script>

<style lang="scss" scoped>
.myLogin{
    width: 100%;
    height: 100%;
    background: #fff;
}
.rollback{
    height: 50px;
    padding-top: 15px;
    padding-left: 15px;
    span{
        font-size: 30px;
    }
}
.rolltitle{
    height: 150px;
    font-size: 30px;
    padding-left: 15px;
}
.loginout{
    padding-left: 15px;
    .telephone{
        height: 60px;
        span{
            font-size: 18px;
            padding-bottom: 12px;
            border-bottom:1px solid  #a1a1a1;
        }
        input{
            width: 280px;
            height: 40px;
            border: transparent;
            outline: none;
            font-size: 18px;
            border-bottom: 1px solid #a1a1a1;
            margin-left: 15px;
        }
    }
    .password{
        height: 60px;
         input{
            width: 320px;
            height: 40px;
            border: transparent;
            outline: none;
            font-size: 20px;
            border-bottom: 1px solid #a1a1a1;
        }
    }
}

.user_hits{
    height: 331px;
    button{
        width: 300px;
        height: 50px;
        border-radius: 20px;
        text-align: center;
        margin-left: 30px;
        margin-top: 50px;
        border: none;
        color: #fff;
        background: #ff672c;
    }
    .user_sign{
        height: 50px;
        padding-top: 20px;
        text-align: center;
        color: #ff672c;
        font-size: 18px;
    }
}
</style>